$(function(){
    fetch(`http://chst.vip:1234/api/getmoneyctrl?pageid=0`)
    .then(body=>body.json())
    .then(res=>{
        let txt = ''
        res.result.forEach(item => {
            let regExp = /(?<=imgurl=)[^'"]*/
            let r = item.productImgSm.match(regExp)
            txt += `<li productId='${item.productId}'>
                        <img src=${r[0]} alt="">
                        <div class="text">
                            <span>${item.productName}</span>
                            <span>${item.productPinkage}</span>
                            <span>${item.productFrom}</span>
                            <span>${item.productTime}</span>
                            <span>${item.productComCount}</span>
                        </div>
                    </li>`
        //计算页数
        function pageCount(totalCount) {
            let pageCount = 0;
            console.log(totalCount);
            if (totalCount >= 1 && totalCount <= 10) {
            pageCount = 1;
            } else if (totalCount % 10 === 0) {
            pageCount = totalCount / 10;
            } else if (totalCount % 10 !== 0) {
            pageCount = Math.floor(totalCount / 10) + 1;
            }
            return pageCount
        }
        let pageCount1 = pageCount(res.totalCount)
        console.log(pageCount1);     
        //生成options内容数组
        let pageArr = [];
        for (let i = 1; i <= pageCount1; i++) {
            pageArr[i - 1] = i;
        }
        
        
        //向页面添加页数选项
        let options = '';
        for (let i = 1; i <= pageCount1; i++) {
            options += `
            <option value=>${pageArr[i-1]}</option>
            `
        }
        $('.page').html(options);
        console.log(pageArr.length-1);
        function toglePage(){
            console.log(countId)
            if (countId === 0) {
                $('.prev').attr({
                    'disabled': true,
                    'style': 'color: rgb(204, 204, 204)'
                })
            } else {
                $('.prev').attr({
                    'disabled': false,
                    'style': 'color: rgb(51, 51, 51)'
                })
            }
            if (countId === pageArr.length-1) {
                $('.next').attr({
                    'disabled': true,
                    'style': 'color: rgb(204, 204, 204)'
                })
            } else {
                $('.next').attr({
                    'disabled': false,
                    'style': 'color: rgb(51, 51, 51)'
                })
            }
        }
        let countId = 0;
        toglePage()
        // 点击下一页
        $('.next').click(function () {
            $('.prev').attr({
                'disabled': false,
                'style': 'color: rgb(51, 51, 51)'
            })
            
            countId++;
            toglePage()
            console.log(countId)
            console.log(pageArr.length-1)
            fetch(`http://chst.vip:1234/api/getmoneyctrl?pageid=0${countId}`)
            .then(body=>body.json())
            .then(res1 => {
                console.log(res1.result)
                let page1 = ''
                res1.result.forEach(item=>{
                    let regExp = /(?<=imgurl=)[^'"]*/
                    let r = item.productImgSm.match(regExp)
                    page1 += `<li productId='${item.productId}'>
                                <img src=${r[0]} alt="">
                                <div class="text">
                                    <span>${item.productName}</span>
                                    <span>${item.productPinkage}</span>
                                    <span>${item.productFrom}</span>
                                    <span>${item.productTime}</span>
                                    <span>${item.productComCount}</span>
                                </div>
                            </li>`
                })
                $('.list ul').html(page1)
            })
            $('select.page').get(0).options[countId].selected = true
        })
        //点击上一页
        $('.prev').click(function () {
            $('.next').attr({
                'disabled': false,
                'style': 'color: rgb(51, 51, 51)'
            })
            countId--;
            toglePage()
            fetch(`http://chst.vip:1234/api/getmoneyctrl?pageid=0${countId}`)
            .then(body=>body.json())
            .then(res1 => {
                let page1 = ''
                res1.result.forEach(item=>{
                    let regExp = /(?<=imgurl=)[^'"]*/
                    let r = item.productImgSm.match(regExp)
                    page1 += `<li productId='${item.productId}'>
                                <img src=${r[0]} alt="">
                                <div class="text">
                                    <span>${item.productName}</span>
                                    <span>${item.productPinkage}</span>
                                    <span>${item.productFrom}</span>
                                    <span>${item.productTime}</span>
                                    <span>${item.productComCount}</span>
                                </div>
                            </li>`
                })
                $('.list ul').html(page1)
            })
                $('select.page').get(0).options[countId].selected = true
        })
        // 选中翻页
        $(".page").change(function () {
           countId = $(this).prop('selectedIndex')
           console.log(countId)
           toglePage()
           fetch(`http://chst.vip:1234/api/getmoneyctrl?pageid=0${countId}`)
           .then(body=>body.json())
           .then(res1 => {
               let page1 = ''
               res1.result.forEach(item=>{
                   let regExp = /(?<=imgurl=)[^'"]*/
                   let r = item.productImgSm.match(regExp)
                   page1 += `<li productId='${item.productId}'>
                                <img src=${r[0]} alt="">
                                <div class="text">
                                    <span>${item.productName}</span>
                                    <span>${item.productPinkage}</span>
                                    <span>${item.productFrom}</span>
                                    <span>${item.productTime}</span>
                                    <span>${item.productComCount}</span>
                                </div>
                            </li>`
               })
               $('.list ul').html(page1)
           })
        })
        })
        $('.list ul').html(txt)
        $('.list ul li').click(function(){
            var productId = $(this).attr('productId')
            location.href = `./shengqian_xq.html?productid=${productId}`
        })
    })
    $('.header_logo').click(function(){
        location.href = '../index.html'
    })
})